<script>
jQuery(document).ready(function(){
    
    jQuery("#month").click(function(){ //alert(2);
         jQuery(".dayView").css('display','none');
         jQuery(".weekView").css('display','none');
         jQuery(".monthView").css('display','block');      
    }); 
    
    jQuery("#week").click(function(){ //alert(2);
         jQuery(".monthView").css('display','none');
         jQuery(".dayView").css('display','none');
         jQuery(".weekView").css('display','block');
    }); 
    
    jQuery("#day").click(function(){ //alert(2);
         jQuery(".monthView").css('display','none');
         jQuery(".weekView").css('display','none');
         jQuery(".dayView").css('display','block');
    }); 
    
    
}); 
</script> 
<?php
echo $this->Html->script(array('jNice', 'fileuploader'));
echo $this->element("scroll_element", array("cache" => true));
?>
              <!--Calendar view: day-->
              <div class="calBoundary">
                <div class="calOptions">
                	<ul class="selectView">
                    	<li id="month"><a href="#">month</a></li>
                        <li id="week"><a href="#">week</a></li>
                        <li id="day"><a href="#" class="selected">day</a></li>
                    </ul>
                    <h2 class="calTitle">march 4th -11th 2011</h2>
                </div>
              	<a href="#" class="movePrev">Prev</a>
                <div class="allCalPlace">
                    <div class="dayView scroll-pane">
                        <div class="dayList">
                            <table width="100%" class="dayTable" border="0" cellspacing="0" cellpadding="0">
                              <tr>
                                <td class="anytime" colspan="2">anytime</td>
                              </tr>
                              <tr>
                                <td colspan="2" class="enterTime">
                                    <div class="enterOuter">
                                        <div class="enterInner">
                                            <div class="enterBody">
                                                <h3>oboe practice</h3>
                                                <h4>setup your oboe in ...</h4>
                                                <div class="enterPlace">
                                                    <label>time:</label>
                                                    <input type="text" class="enterTimeHere" />
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                              </tr>
                              <tr>
                                <td colspan="2" class="enterTime">
                                    <div class="enterOuter">
                                        <div class="enterInner">
                                            <div class="enterBody">
                                                <h3>oboe practice</h3>
                                                <h4>setup your oboe in ...</h4>
                                                <div class="enterPlace">
                                                    <label>time:</label>
                                                    <input type="text" class="enterTimeHere" />
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                              </tr>
                              <tr>
                                <td>12 am</td>
                                <td>&nbsp;</td>
                              </tr>
                              <tr>
                                <td>1 am</td>
                                <td>&nbsp;</td>
                              </tr>
                              <tr>
                                <td>2 am</td>
                                <td>&nbsp;</td>
                              </tr>
                              <tr>
                                <td>3 am</td>
                                <td>&nbsp;</td>
                              </tr>
                              <tr>
                                <td>4 am</td>
                                <td>&nbsp;</td>
                              </tr>
                              <tr>
                                <td>5 am</td>
                                <td>&nbsp;</td>
                              </tr>
                              <tr>
                                <td>6 am</td>
                                <td>&nbsp;</td>
                              </tr>
                              <tr>
                                <td>7 am</td>
                                <td>&nbsp;</td>
                              </tr>
                              <tr>
                                <td>8 am</td>
                                <td>&nbsp;</td>
                              </tr>
                              <tr>
                                <td>9 am</td>
                                <td>&nbsp;</td>
                              </tr>
                              <tr>
                                <td>10 am</td>
                                <td>&nbsp;</td>
                              </tr>
                              <tr>
                                <td>11 am</td>
                                <td>&nbsp;</td>
                              </tr>
                              <tr>
                                <td>12 pm</td>
                                <td>&nbsp;</td>
                              </tr>
                              <tr>
                                <td>1 pm</td>
                                <td>&nbsp;</td>
                              </tr>
                              <tr>
                                <td>2 pm</td>
                                <td>&nbsp;</td>
                              </tr>
                              <tr>
                                <td>3 pm</td>
                                <td>&nbsp;</td>
                              </tr>
                              <tr>
                                <td>4 pm</td>
                                <td>&nbsp;</td>
                              </tr>
                              <tr>
                                <td>5 pm</td>
                                <td>&nbsp;</td>
                              </tr>
                              <tr>
                                <td>6 pm</td>
                                <td>&nbsp;</td>
                              </tr>
                              <tr>
                                <td>7 pm</td>
                                <td>&nbsp;</td>
                              </tr>
                              <tr>
                                <td>8 pm</td>
                                <td>&nbsp;</td>
                              </tr>
                              <tr>
                                <td>9 pm</td>
                                <td>&nbsp;</td>
                              </tr>
                              <tr>
                                <td>10 pm</td>
                                <td>&nbsp;</td>
                              </tr>
                              <tr>
                                <td>11 pm</td>
                                <td>&nbsp;</td>
                              </tr>
                            </table>
                        </div>
                    </div>
                    <div class="weekView" style="display:none;">
                    	<ul class="weekDays">
                        	<li>
                            	<h3>Su</h3>
                                <em>buy an oboe</em>
                                <em>buy an oboe</em>
                                <span class="Date">4</span>
                            </li>
                            <li>
                            	<h3>Su</h3>
                                <em>buy an oboe</em>
                                <em>buy an oboe</em>
                                <span class="Date">5</span>
                            </li>
                            <li>
                            	<h3>Su</h3>
                                <span class="Date">6</span>
                            </li>
                            <li class="current">
                            	<h3>Su</h3>
                                <span class="Date">7</span>
                            </li>
                            <li>
                            	<h3>Su</h3>
                                <em>buy an oboe</em>
                                <em>buy an oboe</em>
                                <span class="Date">8</span>
                            </li>
                            <li>
                            	<h3>Su</h3>
                                <em>buy an oboe</em>
                                <em>buy an oboe</em>
                                <span class="Date">9</span>
                            </li>
                            <li>
                            	<h3>Su</h3>
                                <em>buy an oboe</em>
                                <em>buy an oboe</em>
                                <span class="Date">10</span>
                            </li>
                        </ul>
                    </div>
                    <div class="weekView monthView" style="display:none">
                    	<ul class="monthTable">
                            <li><span class="Date"></span></li>
                            <li><span class="Date"></span></li>
                            <li><span class="Date"></span></li>
                            <li><strong>1</strong><span class="Date"></span></li>
                            <li><span class="Date">1</span></li>
                            <li><span class="Date">2</span></li>
                            <li><strong>2</strong><span class="Date">3</span></li>
                            
                            <li><span class="Date">4</span></li>
                            <li><span class="Date">5</span></li>
                            <li><span class="Date">6</span></li>
                            <li class="current"><span class="Date">7</span></li>
                            <li><strong>2</strong><span class="Date">8</span></li>
                            <li><span class="Date">9</span></li>
                            <li><span class="Date">10</span></li>
                            
                            <li><span class="Date">11</span></li>
                            <li><span class="Date">12</span></li>
                            <li><strong>2</strong><span class="Date">13</span></li>
                            <li><span class="Date">14</span></li>
                            <li><span class="Date">15</span></li>
                            <li><strong>2</strong><span class="Date">16</span></li>
                            <li><span class="Date">17</span></li>
                            
                            <li><span class="Date">18</span></li>
                            <li><strong>1</strong><span class="Date">19</span></li>
                            <li><span class="Date">20</span></li>
                            <li><span class="Date">21</span></li>
                            <li><strong>3</strong><span class="Date">22</span></li>
                            <li><span class="Date">23</span></li>
                            <li><span class="Date">24</span></li>
                            
                            <li><span class="Date">25</span></li>
                            <li><span class="Date">26</span></li>
                            <li><span class="Date">27</span></li>
                            <li><span class="Date">28</span></li>
                            <li><strong>1</strong><span class="Date">29</span></li>
                            <li><span class="Date">30</span></li>
                            <li><span class="Date"></span></li>
                        </ul>
                    </div>
                </div>
                <a href="#" class="moveNext">Next</a>
                <div class="clear">&nbsp;</div>
              </div>
              <!--Calendar view: day-->